<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!--script type="text/javascript" src="js/club-controller.js"></script-->


<script type="text/javascript" language="Javascript">

    $(document).ready(function() {
        //alert("EN PAGINA updateClubFields 002");
    });

    //        data   : "{'Lorem ipsum':'Lorem ipsum','Ipsum dolor':'Ipsum dolor','Dolor sit':'Dolor sit','Dolor Muel':'Dolor Muela derechaA'}",

    $(function() {

      $(".editable_select").editable("updateClub.dahtml", {
        indicator : '<img src="images/update_indicator.gif">',   
        data   : "<%=request.getAttribute("surfaceTypeData")%>",
        type   : "select",
        submit : "OK",
        style  : "inherit",
        name   : 'surfaceTypeId',
        submitdata : function(value, settings) {
            console.log("submitdata this-----------------");
            console.log(this);
            console.log("submitdata this.id-----------------");
            console.log(this.id);
            console.log("submitdata value-----------------");
            console.log(value);
            console.log("submitdata settings-----------------");
            console.log(settings);
            console.log("submitdata-----------------");
          return {id: 33,foo: "bar", clubId: "3", fieldId: this.id};
        },
          callback : function(value, settings) {
           console.log("callback-----------------");
           console.log(this);
           console.log("callback-----------------");
           console.log(value);
           console.log("callback-----------------");
           console.log(settings);
           console.log("callback-----------------");
          },
          onerror : function(settings, original, xhr) {
              console.log("onerror-----------------");
              console.log(settings);
              console.log("onerror-----------------");
              console.log(original);
              console.log("onerror-----------------");
              console.log(xhr);
              console.log("onerror-----------------");
          }

      });
        
      $(".dblclick").editable("updateClub.dahtml", {
          indicator : "<img src='img/indicator.gif'>",
          type      : "text",
          tooltip   : "Doubleclick to edit...",
          event     : "dblclick",
          submit    : "OK",
          cancel    : "Cancel",
          style     : "inherit",
          name      : "mail",
          submitdata : function(value, settings) {
            return {id: 3,foo: "bar", clubId: "33"};
          },
            callback : function(value, settings) {
             console.log("callback-----------------");
             console.log(this);
             console.log("callback-----------------");
             console.log(value);
             console.log("callback-----------------");
             console.log(settings);
             console.log("callback-----------------");
            },
            onerror : function(settings, original, xhr) {
                console.log("onerror-----------------");
                console.log(settings);
                console.log("onerror-----------------");
                console.log(original);
                console.log("onerror-----------------");
                console.log(xhr);
                console.log("onerror-----------------");
            }
      });

    });

</script>


<div id="contenedorUpdateClubFieldsForm">

<table width="200" border="1">
    <caption>Canchas</caption>
    <tr>
        <th scope="col">ID</th>
        <th scope="col">nombre de la cacha</th>
        <th scope="col">Cant de jugadores</th>
        <th scope="col">Techada</th>
        <th scope="col">Superficie</th>
    </tr>

    <c:forEach var="field" items="${fields}">
        
        <tr>
            <td>${field.id}</td>
            <td>${field.name}</td>
            <td>${field.players}</td>
            <td>${field.isRoofed}</td>
            <td><p><B class="editable_select" id="${field.id}" style="display: inline">${field.surfaceType.name}</B></p></td>
        </tr>

    </c:forEach>

</table>


</div>

<!-- ************************************************ -->
<!-- pageName: updateClubFields.jsp                   -->
<!-- ************************************************ -->
